<template>
  <div class="w-full mb-30px">
    <div class="grid grid-column-5 gap-15px" >
      <product v-for="(product, index) in list" :key="index" :item="product" :sizeData="{
          width: '228px',
          height: '228px',
        }"></product>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { useRouter } from 'vue-router'
import { productListApi } from '~/server/goodsApi'
const props = defineProps({
  item: {
    type: Array,
    default: () => []
  },
  current: {
    type: Number,
    default: () => 0
  }
})
const router = useRouter();
const list = ref<any[]>([])

onMounted(() => {
  getData()
})

const getData = async () => {
  
  const ids:any[] = []
  props.item.forEach((item: any) => {
    item.childList.forEach((item: any) => {
      ids.push(item.id)
    })
  })
  const res = await productListApi({
      page: 1,
      limit: 10,
      cid: ids.join(','),
    })
    list.value = res.list
    if(res.list.length === 0){
      console.log('没有数据')
      emit('handleSubmitLeave',props.current)
    }
}

const emit = defineEmits(['handleSubmitLeave'])


</script>
<style scoped lang="scss">

</style>
